import { useEffect, useState } from "react"
import * as api from "@/servers/users"
const Mine = () => {
    let [users, setUsers] = useState<any[]>([])
    let [product, setProduct] = useState<any[]>([])
    // mock数据获取
    let getUserList = async () => {
        try {
            let res = await api.getUserListApi({
                pageSize: 1,
                pageNum: 2,
                sort: 3
            })
            // console.log(res)
            setUsers(res)
        } catch (e) {
            console.log(e)
        }
    }
    let getProductList = async () => {
        try {
            let res = await api.getProductListApi()
            // console.log(res);
            setProduct(res.data)
        } catch (e) {
            console.log(e)
        }
    }
    let login = async () => {
        try {
            let res = await api.loginApi({ username: 'lbw', password: '555' })
            console.log(res);
        } catch (e) {
            console.log(e)
        }
    }
    useEffect(() => { //useEffect里的回调无法加async,可以套个自调用
        getUserList()
        getProductList()
        login()
        // !(async () => {
        //     let res = await api.loginApi('lbw', '555')
        //     console.log(res);
        // })()
    }, [])
    // useEffect(() => {
    //     console.log(product)
    // }, [product])
    return (
        <>
            <h1>个人中心</h1>
            <ul>
                {users.map(item => {
                    return <li key={item.id}>{item.name}</li>
                })}
            </ul>
            <h3>----------分割线----------</h3>
            <ul>
                {product.map(item => {
                    return <li key={item.id}>产品名称:{item.title}----价格:{item.price}----库存:{item.inventory}</li>
                })}
            </ul>
        </>
    )
}
export default Mine